<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
	<title>WeUI</title>
	<!-- 微信UI库 -->
	<link rel="stylesheet" href="/assets/libs/weui/weui.min.css" />
	<!-- jQuery -->
	<script type="text/javascript" src="/assets/libs/jquery/jquery-3.2.1.min.js"></script>
	<!-- 微信JS库 -->
	<script type="text/javascript" src="/assets/libs/weui-js/weui.min.js"></script>
	<!-- 微信JS-SDK -->
	<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
	
	<script type="text/javascript">
	$(function() {
		$.ajax({
			type: 'POST',
			url: 'http://yhaoquan-wx.wicp.net/weixin/js/config',
			data: {'url': location.href.split('#')[0]},
			dataType: 'JSON',
			success: function(result) {
				wx.config({
				    debug: true, 					// 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
				    appId: result.appid, 			// 必填，公众号的唯一标识
				    timestamp: result.timestamp, 	// 必填，生成签名的时间戳
				    nonceStr: result.noncestr, 		// 必填，生成签名的随机串
				    signature: result.signature,	// 必填，签名，见附录1
				 	// 必填，需要使用的JS接口列表，所有JS接口列表见附录2
				    jsApiList: [
				                'scanQRCode',
				                'chooseWXPay',
				                'chooseImage',
				               ] 
				});
				
				wx.ready(function(){
					
					//打开二维码
					$('#qrCode').on('click', function() {
						wx.scanQRCode({
						    needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
						    scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码，默认二者都有
						    success: function (res) {
						    	var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
						    	alert(result) ;
							}
						});
					});
					
					//发起一个支付
					$('#pay').on('click', function() {
						wx.chooseWXPay({
						    timestamp: 1461300911, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
						    nonceStr: '5719aeafb587f', // 支付签名随机串，不长于 32 位
						    package: 'prepay_id=wx20160422125512b7d2205c9c0913643939', // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***）
						    signType: 'SHA1', // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
						    paySign: '5DAB1DDABE1AD34E8FF3386AE971B727', // 支付签名
						    success: function (res) {
						        // 支付成功后的回调函数
						        alert(res) ;
						    }
						});
					});
					
					//拍照或从手机相册中选图接口
					$('#uploadPic').on('click', function() {
						wx.chooseImage({
						    count: 5, // 默认9
						    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
						    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
						    success: function (res) {
						        var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
						        console.info(res);
						        console.info(localIds);
						        var $preview = $('#preview') ;
						        $.map(localIds, function(val) {
						        	console.info(val) ;
						        	$('<img>').attr('src', val).css('width', '100px').css('height', '100px').appendTo($preview) ;
						        });
						        /* wx.previewImage({
						            current: '', // 当前显示图片的http链接
						            urls: localIds // 需要预览的图片http链接列表
						        }); */
						    }
						});
					});
					
				});
				wx.error(function(res){
				    console.info(res);
				});
			},
			error: function(e, ee) {
				console.info(e);
			}
		});
	});
	</script>
</head>

<body>
	<a href="javascript:window.location.reload();" class="weui-btn weui-btn_warn">刷新</a>
    <a href="http://yhaoquan-wx.wicp.net/oauth/wx_auth_process" class="weui-btn weui-btn_primary">授权</a>
    <a id="qrCode" href="javascript:;" class="weui-btn weui-btn_primary">打开微信扫描</a>
    <a id="pay" href="javascript:;" class="weui-btn weui-btn_primary">发起一个支付</a>
    <a id="uploadPic" href="javascript:;" class="weui-btn weui-btn_primary">上传图片</a>
    <a href="uploader.html" class="weui-btn weui-btn_primary">上传图片</a>
    <div id="preview">
    	
    </div>
</body>
</html>